<template>
  <!-- 专辑 -->
  <div id="searchAlbum">
    <van-list v-model="loading"
              :finished="finished"
              finished-text="没有更多了"
              offset="5"
              @load="onLoad">
      <van-cell-group>
        <van-cell v-for="(album,index) in albumList"
                  :key="index"
                  :title="album.name"
                  :label="album.artist.name"
                  @click="handleClick(album.id)" />
      </van-cell-group>
    </van-list>
  </div>
</template>

<script>
import { getSearch } from '@/api/search'
export default {
  name: 'searchAlbum',
  data() {
    return {
      albumList: [],
      loading: true,
      finished: false,
      rowText: '',
      limit: 20,
      type: 10,
    }
  },
  methods: {
    handleClick(id) {
      // this.$router.push({
      //   path: `/songSheet`,
      //   query: { id },
      // })
    },
    onLoad() {
      this.loading = true
      this.limit = this.limit + 10
      this.initData()
    },
    initData() {
      getSearch(this.rowText, this.limit, this.type).then((res) => {
        this.albumList = res.result.albums
        this.loading = false
      })
    },
  },
  created() {
    this.initData()
  },
}
</script>

<style>
</style>